{extend name='template/base'}{/extend}
{block name='style'}{/block}
{block name='script'}{/block}
{block name='content'}
<div class="row">
    <div class="col-xs-12">
        <div class="box-body">
            <div class="row">
                <div class="col-xs-1">
                    <button type="button" class="btn btn-primary" id="add_btn"><i class="fa fa-plus"></i> 添加分类
                    </button>
                </div>
                <div class="col-xs-3">
                    <div class="input-group col-xs-12">
                        <span class="input-group-addon">关键字</span>
                        <input type="text" class="form-control" id="keyword" placeholder="分类名称、店铺"/>
                    </div>
                </div>
                <div class="col-xs-1">
                    <div class="input-group col-xs-12">
                        <select class="form-control select2" id="sel_status">
                            <option selected="selected" value="-1">全部状态</option>
                            <option value="0">失效</option>
                            <option value="1">有效</option>
                        </select>
                    </div>
                </div>
                {if empty($sid)}
                <div class="col-xs-1">
                    <div class="input-group col-xs-12">
                        <select class="form-control select2 store">
                            <option selected="selected" value="-1">全部商家</option>
                            {volist name="store['rows']" id="vo"}
                            <option value="{$vo.id}">{$vo.text}</option>
                            {/volist}
                        </select>
                    </div>
                </div>
                {else/}
                <input type="hidden" class="store" value="{$sid}">
                {/if}
                <div class="col-xs-1">
                    <button type="button" class="btn btn-primary" id="btn_search"><i
                            class="glyphicon glyphicon-search"></i> 搜索
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-xs-12">
        <div class="box">
            <div class="box-body">
                <table id="table"
                       data-toggle="table"
                       data-striped ="true"
                       data-query-params = "requestParam"
                       data-side-pagination="server"
                       data-pagination="true"
                       data-id-field="id"
                       data-url="{:url('ShopGoodsCategory/index_data')}"
                >
                    <thead>
                    <tr>
                        <th data-field="sname">店铺</th>
                        <th data-field="name">分类名称</th>
                        <th data-field="goods_num">商品数量</th>
                        <th data-field="sort" data-sortable="true">排序</th>
                        <th data-field="flag_use" data-formatter="format_flag_use">状态</th>
                        <th data-field="operate" data-formatter="formatOperate" data-events="operateEvents" >操作</th>
                    </tr>
                    </thead>
                </table>
            </div><!-- /.box-body -->
        </div><!-- /.box -->

    </div><!-- /.col -->
</div><!-- /.row -->
{/block}
{block name='script_extra'}
<script>
    var add_data_url="{:url('ShopGoodsCategory/add')}";
    var edit_data_url="{:url('ShopGoodsCategory/edit')}";
    var delete_data_url="{:url('ShopGoodsCategory/delete')}";
</script>
<script>
    // <editor-fold defaultstate="collapsed" desc="格式化url">
    function urlFormat(url) {
        if( url.indexOf('.html')){
            url=url.replace('.html','')
        }
        return url;
    }
    // </editor-fold>


    // <editor-fold defaultstate="collapsed" desc="查询">

    $("#sel_status").on('change', function () {
        $('#table').bootstrapTable('refresh');
    })
    $("#store").on('change', function () {
        $('#table').bootstrapTable('refresh');
    })
    //搜索按钮事件
    $("#btn_search").on('click', function () {
        $('#table').bootstrapTable('refresh');
    })

    var temp = {};
    function requestParam(params) {
        temp = {
            limit: params.limit, //页面大小
            offset: params.offset, //页码
            order: params.order,
            sort: params.sort,
            search: $("#keyword").val(),
            store: $(".store").val(),
            status: $("#sel_status").val()
        };
//        console.log(temp);
        return temp;
    }

    // </editor-fold>


    // <editor-fold defaultstate="collapsed" desc="添加">
    $('#add_btn').on('click',function () {
        layer_open('添加',urlFormat(add_data_url)+"/sid/{$sid}",{w:"800px",h:"350px"})
    });
    // </editor-fold>
    // <editor-fold defaultstate="collapsed" desc="操作按钮">
    function formatOperate(value,row,index){
        console.log(row)
        return [
            '<button class="btn btn-warning btn-xs row_edit" href="javascript:void(0)">',
            '<i class="fa fa-edit"></i> 修改',
            '</button>&nbsp;',
            '<button class="btn btn-danger btn-xs row_delete" href="javascript:void(0)">',
            '<i class="fa fa-trash"></i> 删除',
            '</button>'
        ].join('');
//        if(row.isdefault == 1){
//            return [
//                '<button class="btn btn-default btn-xs" href="javascript:void(0)" disabled="disabled">',
//                '<i class="fa fa-edit"></i> 修改',
//                '</button>&nbsp;',
//                '<button class="btn btn-default btn-xs" href="javascript:void(0)" disabled="disabled">',
//                '<i class="fa fa-trash"></i> 删除',
//                '</button>'
//            ].join('');
//        }else{
//            return [
//                '<button class="btn btn-warning btn-xs row_edit" href="javascript:void(0)">',
//                '<i class="fa fa-edit"></i> 修改',
//                '</button>&nbsp;',
//                '<button class="btn btn-danger btn-xs row_delete" href="javascript:void(0)">',
//                '<i class="fa fa-trash"></i> 删除',
//                '</button>'
//            ].join('');
//        }
    }

    // </editor-fold>
    // <editor-fold defaultstate="collapsed" desc="操作函数">
    window.operateEvents = {
        'click .row_edit': function (e, value, row, index) {
            layer_open('更改分类信息',urlFormat(edit_data_url)+"/id/"+row.id+"/num/"+row.goods_num+"/sid/{$sid}",{w:"800px",h:"350px"});
        },
        'click .row_delete': function (e, value, row, index) {
            layer.confirm('你确定要删除该选项吗？',{btn:['确定','取消']},function () {
                $.ajax({
                    dataType:'json',
                    data:{id:row.id,store_id:row.store_id},
                    url:delete_data_url,
                    success:function (res) {
                        if(res.success){
                            layer.msg(res.message, {time: 1000},function () {
                                $('#table').bootstrapTable('refresh');
                            });
                        }else{
                            layer.alert(res.message);
                        }
                    }
                })
            })
        },
    }

    // </editor-fold>

    // <editor-fold defaultstate="collapsed" desc="状态格式化">
    function format_flag_use(value) {
        switch(value){
            case 1:
                return '<i class="fa fa-check-circle text-green" title="有效">有效</i>';break;
            case 0:
                return '<i class="fa fa-minus-circle text-yellow" title="失效">失效</i>';break;
        }

    }
    // </editor-fold>

</script>
{/block}